.checkbox-1{
  position:relative; 
  display:inline-block; 
  vertical-align:middle; 
  -webkit-box-sizing: border-box; 
          box-sizing: border-box;

  input{
    opacity:0;
    margin-right: 5px;

    /*匹配所有选中的checkbox*/
    &:checked+span{
       @include icon(#{$imagePath+'icon_checkbox_active.png'}, 30px, 30px);
    }  

    /*匹配所有未选中的checkbox*/
    &:not(checked)+span{
       @include icon(#{$imagePath+'icon_checkbox.png'}, 30px, 30px);
    }   
  }  

  &.unable{
    input{
      &+span{
        background: #ccc;
        border-radius: 30px;
      }
    }
  } 
}